@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  html {
    font-family: 'Inter', system-ui, sans-serif;
  }
  
  body {
    @apply bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-gray-100;
  }
  
  * {
    @apply border-gray-200 dark:border-gray-700;
  }
}

@layer components {
  .editor-container {
    @apply h-full w-full relative;
  }
  
  .sidebar {
    @apply bg-white dark:bg-gray-800 border-r border-gray-200 dark:border-gray-700;
  }
  
  .toolbar {
    @apply bg-gray-100 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700;
  }
  
  .status-bar {
    @apply bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 text-sm;
  }
}
